﻿@model BeautyTech.WebSite.Models.Catalog.ProductModel

@{
    ViewBag.Title = "Product";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
@*
<h2>Product</h2>

<section class ="row">
    <div class="span4"><img src="http://images.beauty-tech.fr/catalog/products/large/@(Model.Reference).jpg" /></div>
    <div class="span8">
        <div class="display-label">
            @Html.DisplayNameFor(model => model.Reference)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Reference)
        </div>
        <div class="display-label">
            @Html.DisplayNameFor(model => model.Name)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.Name)
        </div>
        <div class="display-label">
            @Html.DisplayNameFor(model => model.DisplayName)
        </div>
        <div class="display-field">
            @Html.DisplayFor(model => model.DisplayName)
        </div>
    </div>
</section>


<p>
    @Html.ActionLink("Edit", "Edit", new { id=Model.ID }) |
    @Html.ActionLink("Back to List", "Index")
</p>
*@

<!-- Start Site Container --> 
<div class="container make-bg" id="article">
    
        @Html.Action("ProductBreadcrumb")

    	<div class="row">
            
		<div class="span9 post">
			<h2 class="page-header"><span>@Model.Name</span></h2>
			<div class="sidebar-line"><span></span></div>                    
                <div class="row-fluid product-info">
                    <div class="span7">
                        <div class="cf">
                            <span class="productwrap"><img id="demo4" src="http://images.beauty-tech.fr/catalog/products/medium/@(Model.Reference).jpg" /></span>
						<ul id="demo4carousel" class="elastislide-list">
							<li><a href="#"><img src="demo-images/02_product.jpg" data-largeimg="demo-images/02_01_product.jpg" /></a></li>
							<li><a href="#"><img src="demo-images/03_product.jpg" data-largeimg="demo-images/03_01_product.jpg" /></a></li>
							<li><a href="#"><img src="demo-images/04_product.jpg" data-largeimg="demo-images/04_01_product.jpg" /></a></li>
							<li><a href="#"><img src="demo-images/05_product.jpg" data-largeimg="demo-images/05_01_product.jpg" /></a></li>
							<li><a href="#"><img src="demo-images/06_product.jpg" data-largeimg="demo-images/06_01_product.jpg" /></a></li>
						</ul>
					</div>
				</div>

                    <div class="span5">
                        <h2 class="post-title">Single product item with awesome overviews!</h2>
                <p>The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.</p>
               
                            <div class="price">
                                <span class="price-old">$9.22</span> <span class="price-new">$14.00</span>
                                <span class="price-tax">Ex Tax: $22.00</span><br>
                                <span class="reward"><small>Price in reward points: 93</small></span> <br>
                            </div>
                    
                            <div class="row-fluid">
                                <div class="span6">
                                        <input class="span9" type="text" name="quantity" size="2" value="Qty: 1">
                                </div>
                                    
                                <div class="span6">
                                    <a class="btn btn-general" title="Add to Cart">
                                    <span><i class="icon-shopping-cart"></i> Acheter</span>
                                    </a>
								</div>
                            </div>

                    		<div class="row-fluid">
                                <div class="span6">
                                    <span class="required">*</span>
                                    <b>Size:</b>
                                    <br>
                                    <select>
                                    <option value=""> --- Please Select --- </option>
                                    <option value="">Small</option>
                                    <option value="">Medium</option>
                                    <option value="">Large</option>
                                    </select>
                                </div>
                                <div class="span6">
                                    <span class="required">*</span>
                                    <b>Color:</b>
                                    <br>
                                    <select>
                                    <option value=""> --- Please Select --- </option>
                                    <option value="">Blue</option>
                                    <option value="">Red</option>
                                    <option value="">Orange</option>
                                    <option value="">Purple</option>
                                    <option value="">Pink</option>
                                    <option value="">Black</option>
                                    <option value="">White</option>
                                    </select>
                                </div>
                            </div>
                                
                            <div class="deal-share">
                                <!-- AddThis Button BEGIN -->
                                <div class="addthis_toolbox addthis_default_style">
                                <a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
                                <a class="addthis_button_tweet"></a>
                                <a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
                                </div>
                                <script type="text/javascript" src="../../../s7.addthis.com/js/300/addthis_widget.js#pubid=undefined"></script>
                                <!-- AddThis Button END -->
							</div>
                                
                    </div>
                </div>
                    
		<!-- Start Review Area" -->
		<section id="TabElements" class="product-info">
            <ul id="myTab" class="nav nav-tabs">
                <li class="active"><a href="#information" data-toggle="tab">PRODUCT Information</a></li>
                <li><a href="#reviews" data-toggle="tab">REVIEWS</a></li>
                <li><a href="#tags" data-toggle="tab">Product Tags</a></li>
            </ul>
            <div id="myTabContent" class="tab-content">
                <div class="tab-pane fade in active" id="information">
                    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
                    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
                    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s.</p>
                </div>
                <div class="tab-pane fade" id="reviews">
                <div class="row-fluid">
                    <div class="span6">

							<div class="single-review clearfix">
								<div class="review-header">
									<ul class="rating">
										<li><i class="star-on"></i></li>
										<li><i class="star-on"></i></li>
										<li><i class="star-off"></i></li>
										<li><i class="star-off"></i></li>
										<li><i class="star-off"></i></li>
									</ul>
									<h4>John Doe</h4>
									<small>11/09/2013</small>
								</div><!--end review-header-->

								<div class="review-body">
									<p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
								</div><!--end review-body-->
							</div><!--end single-review-->

							<div class="single-review clearfix">
								<div class="review-header">
									<ul class="rating">
										<li><i class="star-on"></i></li>
										<li><i class="star-on"></i></li>
										<li><i class="star-on"></i></li>
										<li><i class="star-on"></i></li>
										<li><i class="star-off"></i></li>
									</ul>
									<h4>John Doe</h4>
									<small>03/11/2013</small>
								</div><!--end review-header-->

								<div class="review-body">
									<p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
								</div><!--end review-body-->
							</div><!--end single-review-->		

							<div class="single-review clearfix">
								<div class="review-header">
									<ul class="rating">
										<li><i class="star-on"></i></li>
										<li><i class="star-on"></i></li>
										<li><i class="star-on"></i></li>
										<li><i class="star-on"></i></li>
										<li><i class="star-on"></i></li>
									</ul>
									<h4>John Doe</h4>
									<small>12/22/2013</small>
								</div><!--end review-header-->

								<div class="review-body">
									<p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
								</div><!--end review-body-->
							</div><!--end single-review-->	

					</div>
                    <div class="span6">
                        <section class="single-review" style="margin-top:-30px;">
                        <h3 class="page-header">Leave a Review</h3>
                            
                        <form>
                            <label for="name">Name</label>
                            <input id="name" name="name" class="span9" type="text">
                            <label for="email">Email</label>
                            <input id="email" name="email" class="span9" type="email">
                            <label for="comment">Comment</label>
                            <textarea id="comment" name="comment" class="span9" cols="45" rows="5"></textarea>
                            <button class="btn btn-general" type="submit">Post a Review</button>
                        </form>
                        <div class="review-header" style="margin-top:20px;">
                            <ul class="rating">
                                <li><i class="star-on"></i></li>
                                <li><i class="star-on"></i></li>
                                <li><i class="star-on"></i></li>
                                <li><i class="star-on"></i></li>
                                <li><i class="star-on"></i></li>
                            </ul>
                            <p>What is your rating for this product?</p>
                            </div><!--end review-header-->
					</section>
					</div>
                </div>
                </div>
                <div class="tab-pane fade" id="tags">
                <p>Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.</p>
				<form class="form-inline">
					<input class="input-block span2" placeholder="Enter your tags here" type="text" id="tags" />
					<button type="submit" class="btn btn-general">Add Tag</button>
				</form>
                </div>
            </div>
		</section>
                    
		<!-- Start Related -->
    <div class="row-fluid">
		<div class="span12">
            <h2 class="widget-title"><span>Related Project's</span></h2>
			<div class="sidebar-line"><span></span></div>
			<div class="for-womans flexslider flex-direction-nav-on-top">
				<ul class="slides">
					<li>
						<div class="span4">
							<div class="wdt-product">
								<div class="wdt-products-wrapper">
									<div class="wdt-product active show">
										<a href="product.html" title="Slim Shoart"><img src="demo-images/01_sidebar.jpg" alt="Slim Shoart" /></a>
										<h4><a href="product.html" title="Slim Shoart">Slim Shoart</a></h4>
                                        <ul class="rating">
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-off"></i></li>
                                        </ul>
										<div class="wdt-pricing">
										<span class="amount">&euro;34.31</span>
										</div>
										<div class="wdt-cart">
											<div class="wdt-cart-bar">
												<a href="product.html" title="Slim Shoart"><i class="icon-shopping-cart"></i> Add to basket</a>
										</div>
										</div>
										<div class="wdt-overlay">
											<span class="amount">&euro;34.31</span>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="span4">
							<div class="wdt-product">
								<div class="wdt-products-wrapper">
									<div class="wdt-product active show">
										<a href="product.html" title="Super T-Shirt"><img src="demo-images/02_sidebar.jpg" alt="Cool Bag" /></a>
										<h4><a href="product.html" title="Super T-Shirt">Super T-Shirt</a></h4>
                                        <ul class="rating">
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-off"></i></li>
                                        </ul>
										<div class="wdt-pricing">
										<span class="amount">&euro;31.22</span>
										</div>
										<div class="wdt-cart">
											<div class="wdt-cart-bar">
												<a href="product.html" title="Super T-Shirt"><i class="icon-shopping-cart"></i> Add to basket</a>
										</div>
										</div>
										<div class="wdt-overlay">
											<span class="amount">&euro;31.22</span>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="span4">
							<div class="wdt-product">
								<div class="wdt-products-wrapper">
									<div class="wdt-product active show">
										<a href="product.html" title="Green Dresses"><img src="demo-images/03_sidebar.jpg" alt="Cool Bag" /></a>
										<h4><a href="product.html" title="Green Dresses">Green Dresses</a></h4>
                                        <ul class="rating">
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-off"></i></li>
                                            <li><i class="star-off"></i></li>
                                        </ul>
										<div class="wdt-pricing">
										<span class="amount">&euro;55.12</span>
										</div>
										<div class="wdt-cart">
											<div class="wdt-cart-bar">
												<a href="product.html" title="Green Dresses"><i class="icon-shopping-cart"></i> Add to basket</a>
										</div>
										</div>
										<div class="wdt-overlay">
											<span class="amount">&euro;55.12</span>
										</div>
									</div>
								</div>
							</div>
						</div>
					</li>
					<li>
						<div class="span4">
							<div class="wdt-product">
								<div class="wdt-products-wrapper">
									<div class="wdt-product active show">
										<a href="product.html" title="Slim Shoart"><img src="demo-images/01_sidebar.jpg" alt="Slim Shoart" /></a>
										<h4><a href="product.html" title="Slim Shoart">Slim Shoart</a></h4>
                                        <ul class="rating">
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-off"></i></li>
                                        </ul>
										<div class="wdt-pricing">
										<span class="amount">&euro;34.31</span>
										</div>
										<div class="wdt-cart">
											<div class="wdt-cart-bar">
												<a href="product.html" title="Slim Shoart"><i class="icon-shopping-cart"></i> Add to basket</a>
										</div>
										</div>
										<div class="wdt-overlay">
											<span class="amount">&euro;34.31</span>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="span4">
							<div class="wdt-product">
								<div class="wdt-products-wrapper">
									<div class="wdt-product active show">
										<a href="product.html" title="Super T-Shirt"><img src="demo-images/02_sidebar.jpg" alt="Cool Bag" /></a>
										<h4><a href="product.html" title="Super T-Shirt">Super T-Shirt</a></h4>
                                        <ul class="rating">
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-off"></i></li>
                                        </ul>
										<div class="wdt-pricing">
										<span class="amount">&euro;31.22</span>
										</div>
										<div class="wdt-cart">
											<div class="wdt-cart-bar">
												<a href="product.html" title="Super T-Shirt"><i class="icon-shopping-cart"></i> Add to basket</a>
										</div>
										</div>
										<div class="wdt-overlay">
											<span class="amount">&euro;31.22</span>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="span4">
							<div class="wdt-product">
								<div class="wdt-products-wrapper">
									<div class="wdt-product active show">
										<a href="product.html" title="Green Dresses"><img src="demo-images/03_sidebar.jpg" alt="Cool Bag" /></a>
										<h4><a href="product.html" title="Green Dresses">Green Dresses</a></h4>
                                        <ul class="rating">
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-on"></i></li>
                                            <li><i class="star-off"></i></li>
                                            <li><i class="star-off"></i></li>
                                        </ul>
										<div class="wdt-pricing">
										<span class="amount">&euro;55.12</span>
										</div>
										<div class="wdt-cart">
											<div class="wdt-cart-bar">
												<a href="product.html" title="Green Dresses"><i class="icon-shopping-cart"></i> Add to basket</a>
										</div>
										</div>
										<div class="wdt-overlay">
											<span class="amount">&euro;55.12</span>
										</div>
									</div>
								</div>
							</div>
						</div>
					</li>
				</ul>
			</div>
		</div>  </div>               
                    
                    
		</div><!-- end post span -->
      
                
		<div class="span3 sidebar">
            <div class="widget">
            <h2 class="widget-title"><span>Recent Review Items</span></h2>
			<div class="sidebar-line"><span></span></div>
		<ul class="reviews-posts">
			<li>
                <div class="review-thumbnail">
                    <a href="#" title="Permalink to this product" rel="bookmark"><img class="img-polaroid" width="70" src="demo-images/01_sidebar.jpg" alt="" /></a>
                </div><!-- review-thumbnail /-->
                    <h3><a href="#" title="Permalink to this product" >Latest review Item</a></h3> 	
                       
				<ul class="rating">
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
				</ul>
			</li>
                
			<li>
                <div class="review-thumbnail">
                    <a href="#" title="Permalink to this product" rel="bookmark"><img class="img-polaroid" width="70" src="demo-images/03_sidebar.jpg" alt="" /></a>
                </div><!-- review-thumbnail /-->
                    <h3><a href="#" title="Permalink to this product" >Latest review Item</a></h3> 	
                       
				<ul class="rating">
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
					<li><i class="star-off"></i></li>
					<li><i class="star-off"></i></li>
				</ul>
			</li>
                
            <li>
                <div class="review-thumbnail">
                    <a href="#" title="Permalink to this product" rel="bookmark"><img class="img-polaroid" width="70" src="demo-images/03_sidebar.jpg" alt="" /></a>
                </div><!-- review-thumbnail /-->
                    <h3><a href="#" title="Permalink to this product" >Latest review Item</a></h3> 	
                       
				<ul class="rating">
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
					<li><i class="star-on"></i></li>
					<li><i class="star-off"></i></li>
				</ul>
			</li>
		</ul>
        </div>
            
            <div class="widget">
			<h2 class="widget-title"><span>Site Categories</span></h2>
			<div class="sidebar-line"><span></span></div>
				<ul class="bullet_arrow2 categories">
                    <li><a href="category-list.html">Woman's</a></li>
                    <li><a href="category-list.html">Mans's</a></li>
                    <li><a href="category-list.html">Child's</a>
                        <ul>
                            <li><a href="category-list.html">Bags</a></li>
                            <li><a href="category-list.html">Jevellery</a></li>
                            <li><a href="category-list.html">Shoes</a></li>
                            <li><a href="category-list.html">Shirts</a></li>
                        </ul>
                    </li>
                    <li><a href="category-list.html">Holiday Sale's</a></li>
                    <li><a href="category-list.html">Special Promotions</a></li>
                    <li><a href="category-list.html">Father Day's</a></li>
                    <li><a href="category-list.html">Happy Valentines</a></li>
				</ul>
			</div>
                
            <div class="widget">        
            <h2 class="widget-title"><span>Advertising</span></h2>
            <div class="sidebar-line"><span></span></div>
                <img src="demo-images/01_sidebar-ads.jpg" width="250" alt=""/>
                        
                </div>
            </div>
            </div>
        @Html.Action("RelatedProducts", "Catalog", new { productId = Model.Id })
</div>
<!-- End Site Container -->